$(function() {
    $('#Commonbottom').load('../assets/public/html/PublicBottom.html');

    //显示职位
    let disOff = Interceptor('/disOff', 'post');
    disOffLoop();

    function disOffLoop() {
        if (disOff.data.length == 0) {
            const categorye = ` 
                <div class="category"> 
                    <p style="font-size: 26px;color:#666;line-height:280px;text-align: center;">暂无发布职位</p>
                </div>
            `
            $('.JobClassification').append(categorye);
        } else {
            disOff.data.slice(0, 7);
            for (i = 0; i < disOff.data.length; i++) {
                const category = `
                    <div class="category">
                        <span href="#" class="class">${disOff.data[i].class}</span>
                        <li>
                            <a href="../views/SearchPage.html?SearchContent=${disOff.data[i].official}">${disOff.data[i].official}</a>
                        </li>
                        <img src="https://19jwshow.oss-cn-shenzhen.aliyuncs.com/recruit/icon/rightarrow_1f.png" alt="">
                        <div class="Expansion">
                            <p class="orangeTitle">${disOff.data[i].class}</p>
                            <div class="SmallClassification">
                                <div class="classiFica">
                                    <a href="../views/SearchPage.html?SearchContent=${disOff.data[i].official}" class="classLinkPosition">${disOff.data[i].official}</a>
                                </div>
                            </div>
                        </div>
                    </div>
                 `
                $('.JobClassification').append(category);

            }
            $(".category").hover(function() {
                $(this).addClass("category_orange");
                $(".category_orange>.class").css("color", "#fff");
                $(".category_orange>li>a").css("color", "#fff");
                $(".category_orange>img").attr("src", "https://19jwshow.oss-cn-shenzhen.aliyuncs.com/recruit/icon/rightarrow_1fw.png");
                $(this).children(".Expansion").show(10, function() {});
            }, function() {
                $(".category_orange>.class").css("color", "#333");
                $(".category>li>a").css("color", "#666");
                $(".category>img").attr("src", "https://19jwshow.oss-cn-shenzhen.aliyuncs.com/recruit/icon/rightarrow_1f.png");
                $(this).removeClass("category_orange");
                $(this).addClass("category");
                $(this).children(".Expansion").hide(10, function() {});
            });
        }
    }

    //热门职位
    let hotJob = Interceptor('/hotJob', 'post');
    if (hotJob.data.length != 0) {
        loop();
    } else {
        const nothing = `
        <div style="width:1200px;height:60px;margin-top:-15px;line-height:60px;background-color:#fff;margin-bottom:30px;">
           <p style = "font-size: 26px;color:#666;text-align: center;"> 暂无热门职位发布</p>
        </div>
        `
        $(".hot_position_title>ul").html(nothing);
    }

    function loop() {
        let hotJobs = hotJob.data.slice(0, 6);
        for (i = 0; i < hotJobs.length; i++) {
            const hotJobTitle = ` 
                    <li class="sort" onclick="sortText($(this))">${hotJob.data[i].class}</li>  
                `
            $(".hot_position_title>ul").append(hotJobTitle);
            const hotJobDetails = ` 
                    <div class="hotJobBox">
                        <a href="PositionDetailsPage.html?officialId=${hotJob.data[i].official_id}">
                        <div class="job_title">
                            <div class="job_title_left">
                                <p class='post'> ${hotJob.data[i].official} </p>
                                <div class="address">
                                <img src="https://19jwshow.oss-cn-shenzhen.aliyuncs.com/recruit/icon/icon-location.png" alt = "">
                                <span class="regions"> ${hotJob.data[i].company_area}</span>
                            </div> 
                        </div> 
                        <span class="salary"> ${ hotJob.data[i].job_money}<span>薪</span></span>
                    </div> 
                    <div class="classification">
                        <span class="pag">${hotJob.data[i].education}</span> 
                        <span class="pag">工作时间${ hotJob.data[i].wordweek}天</span>
                        <span class="pag"> ${hotJob.data[i].company_welfare}</span> 
                        <span class="pag">...</span>
                        <span class="pag OffID"style = "display:none;">${hotJob.data[i].official_id}</span>
                    </div> 
                    <div class = "art">
                        <div class="hot_logo">
                            <img src="${hotJob.data[i].company_logo}"alt="">
                        </div>
                        <div class = "hot_job_name">
                            <span class="com_name"> ${hotJob.data[i].company_name }</span>
                            <span class="type"> ${hotJob.data[i].type }</span> 
                        </div> 
                    </div>
                `
            $(".Hot_job_details").append(hotJobDetails);
        }
        sortText = function(Sort) {
            var Sort_Text = Sort.text();
            choseJobLoop();

            function choseJobLoop() {
                var classification = Interceptor('/choseJob', 'post', {
                    'class': Sort_Text
                });
                if (classification.data.length != 0) {
                    let classFication = classification.data.slice(0, 5);
                    for (i = 0; i < classFication.length; i++) {
                        const choseJob = ` 
                        <div class="hotJobBox">
                            <a href="PositionDetailsPage.html?officialId=${classification.data[i].official_id}">
                                <div class="job_title">
                                    <div class="job_title_left">
                                            <p class='post'> ${classification.data[i].official}</p> 
                                            <div class="address"  >
                                                <img src="https://19jwshow.oss-cn-shenzhen.aliyuncs.com/recruit/icon/icon-location.png">
                                                <span class="regions"> ${classification.data[i].company_area}</span> 
                                            </div> 
                                    </div> 
                                    <span class="salary"> ${classification.data[i].job_money}<span>薪</span></span>
                                </div>
                                 <div class="classification">
                                    <span class="pag"> ${classification.data[i].education}</span>
                                    <span class="pag"> 工作时间${classification.data[i].wordweek}天</span> 
                                    <span class="pag"> ${classification.data[i].company_welfare}</span> 
                                    <span class="pag"> ... </span> 
                                    <span class="pag OffID"style="display:none;">${ classification.data[i].official_id }</span> 
                                </div>
                                <div class="art">
                                    <div class="hot_logo">
                                    <img src="${classification.data[i].company_logo}">
                                    </div>
                                    <div class="hot_job_name">
                                        <span class="com_name">${classification.data[i].company_name}</span> 
                                        <span class="type"> ${ classification.data[i].type}</span>
                                    </div>
                                </div> 
                            </a> 
                        </div>
                    `
                        $(".Hot_job_details").html(choseJob);
                    }
                } else {
                    const nothingPosition = `
                        <div style="width:1200px;height:60px;line-height:60px;background-color:#fff;margin-bottom:30px;">
                            <p style="font-size: 26px;color:#666;text-align: center;"> 暂无该类型职位</p>
                        </div>
                    `
                    $(".Hot_job_details").html(nothingPosition);
                }
            }

        };
    }

    //热门公司

    let hotCompany = Interceptor('/hotCompany', 'post');
    comLoop(hotCompany);

    function comLoop(hotCompany) {
        if (hotCompany.data.length != 0) {
            for (i = 0; i < hotCompany.data.length; i++) {
                const hotCompanyRecommend = `
                <div class = "comoaniesBox" >
                   <a href = "CompanyIntroduce.html?CompanyId=${hotCompany.data[i].company_id}">
                   <div style = "height:100px;width:150px" >
                       <img src = "${hotCompany.data[i].company_logo}"class = "companiesLogo" >
                   </div> 
                   <div class = "computer_box clearfix"style = "margin-left:30px;">
                       <div class = "computer_title" >
                           <div class = "com_name" >
                               <span> ${hotCompany.data[i].company_name} </span>
                           </div> 
                           <div class = "address">
                               <img src = "https://19jwshow.oss-cn-shenzhen.aliyuncs.com/recruit/icon/icon-location.png"alt = "" >
                               <span class = "regions"> ${hotCompany.data[i].company_area} <span> 
                           </div> 
                       </div> 
                           <p class = "type"> ${hotCompany.data[i].type} </p> 
                           <div class = "wages">
                               <span class = "num"> ${hotCompany.data[i].com_official}个职位 </span>
                               <span class = "num"> ${hotCompany.data[i].range_money} <span> 薪 </span></span>
                           </div>
                       </div> 
                   </a> 
                </div> 

                    `
                $('.recommend').append(hotCompanyRecommend);
            }
        } else {
            const nothing = `
             <div style="width:1200px;height:60px;line-height:60px;background-color:#fff;margin-bottom:30px;">
                <p style = "font-size: 26px;color:#666;text-align: center;" > 暂无公司注册 </p>
             </div>
            `
            $('.recommend').append(nothing);
        }

    }

});